<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap-responsive.css" />
    <link rel="stylesheet" type="text/css" href="../Css/style.css" />
    <script type="text/javascript" src="../Js/jquery.js"></script>
    <script type="text/javascript" src="../Js/jquery.sorted.js"></script>
    <script type="text/javascript" src="../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../Js/ckform.js"></script>
    <script type="text/javascript" src="../Js/common.js"></script>
	<script>
	    $(function () {
	        $(':checkbox[name="group[]"]').click(function () {
	            $(':checkbox', $(this).closest('li')).prop('checked', this.checked);
	        });
			$('#backid').click(function(){
					window.location.href="role_index.jsp";
			 });
			$('#edit').click(function(){
				edit();
		 });
			info();
	    });
	    function option(){
	    	//判断是info还是edit 如过为2：查看角色信息
	    	if($("#oper").val()==2?true:false){
	    		//
	    		$("input[name='roleName']").attr("type","hidden");
	    		$("textarea[name='roleDes']").attr("disabled",true);
	    		$("input[name='roleState']").attr("type","hidden");
	    		$("#tbody").attr("style","display:none");
	    		//姓名
	    		$("#td_roleName").text($("#rn").val());
	    		//状态
				var id_=$("#status").val()=="1"?"#status0":"#status1";
				$(id_).attr("style","display:none");
				
				$("#save").attr("type","hidden");
				$("#edit").attr("type","button");
	    	}
	    }
	    //查看角色信息
	    function info(){
			$.ajax({
				url:'<%=basePath%>RoleServlet',
				data:$("#actionForm").serialize(),
				type:"post",
				dataType:"json",
				success:function(data){
					if(data.list.length>0){
						$.each(data.list,function(i,ele){
							//名称
							$("#rn").val(ele.roleName);
							//文本
							$("textarea[name=roleDes]").val(ele.roleDes);
							//状态
							//var state_=;
							$("input:checkbox[value='1']").attr("checked","checked");
							//
						});
					}
					$("#edit").attr("type","hidden");
					//加载完之后重置页面
					option();
				}
			});
	    }
	    function edit(){
    		//
    		$("input[name='roleName']").attr("type","text");
    		$("textarea[name='roleDes']").attr("disabled",false);
    		$("input[name='status']").attr("type","radio");
    		$("#tbody").attr("style","");
    		//姓名
    		$("#td_roleName").text("");
    		//状态
			$("#save").attr("type","button");
			$("#edit").attr("type","hidden");
	    }
	    //编辑提交
	    function editSubmit(){
	    	$("#oper").val("edit");
			$.ajax({
				url:'<%=basePath%>RoleServlet',
				data:$("#actionForm").serialize(),
				type:"post",
				dataType:"json",
				success:function(data){
					if(data!=null){
						if(data.message>0){
							alert("保存成功");
							location.href="role_index.jsp";
						}
					}
				}
			});
	    }
	</script>
    <style type="text/css">
    		body { padding-bottom: 40px;}.sidebar-nav {padding: 9px 0;} @media (max-width: 980px) {
            /* Enable use of floated navbar text */.navbar-text.pull-right {float: none;padding-left: 5px;
                padding-right: 5px;}} ul li{ list-style-type:none; }
    </style>
</head>
<body>
<form action="RoleServlet" method="post" id="actionForm" class="definewidth m20" >
	<input type="hidden" name="oper" id="oper" value="${param.oper}" />
	<input type="hidden" name="roleId" id="roleId" value="${param.roleId }" />
	<table class="table table-bordered table-hover  m10" id="info" >
		<thead>
	    <tr>
	        <td width="10%" class="tableleft">名称</td>
	        <td ><input type="text" name="roleName" id="rn" /><span id="td_roleName"></span></td>
	    </tr>
	    <tr>
	        <td width="10%" class="tableleft">描述</td>
	        <td id="description"><textarea name="roleDes"></textarea></td>
	    </tr>
	    <tr>
	        <td width="10%" class="tableleft">状态</td>
	        <td id="status">
	            <input type="radio" name="roleState" value="1" id="state1"  /><span id="status1"> 启用</span>
	            <input type="radio" name="roleState" value="0" id="state0" /><span id="status0"> 禁用</span>
	        </td>
	        
	    </tr>
		</thead>
		<tbody id="tbody">
		 <tr>
	        <td class="tableleft">权限</td>
	        <td>
		        <ul>
			        <li>
				        <label class='checkbox inline'>
				        <input type='checkbox' name='group[]' value='' />公用节点</label>
				        <ul>
					        <li>
						        <label class='checkbox inline'>
						        <input type='checkbox' name='node[]' value='21' checked/>省市区级联数据</label>
					        </li>
					        <li>
						        <label class='checkbox inline'>
						        <input type='checkbox' name='node[]' value='22' checked/>省市区数据获取</label>
				        	</li>
				        </ul>
			        </li>
			        <li>
				        <label class='checkbox inline'>
				        <input type='checkbox' name='group[]' value='' />权限</label>
				    <ul>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='1' checked/>权限列表</label>
				        </li>
				        <li>
				        	<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='2' checked/>权限添加</label>
				        </li>
				        <li>
				        	<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='3' checked/>权限编辑</label>
				        </li>
				        <li>
				        	<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='4' checked/>权限删除</label>
				        </li>
			        </ul>
		        </li>
		        <li>
			        <label class='checkbox inline'>
			        <input type='checkbox' name='group[]' value='' />用户</label>
			        <ul>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='9' checked/>用户列表</label>
				        </li>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='10' checked/>用户添加</label>
				        </li>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='11' checked/>用户编辑</label>
				        </li>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='12' checked/>用户删除</label>
			        	</li>
			        </ul>
		        </li>
		        <li>
			        <label class='checkbox inline'>
			        <input type='checkbox' name='group[]' value='' />菜单管理</label>
			        <ul>
				        <li>
				        	<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='13' checked/>菜单列表</label>
				        </li>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='14' checked/>菜单新增</label>
				        </li>
				        <li>
				       		<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='15' checked/>菜单编辑</label>
				        </li>
				        <li>
					        <label class='checkbox inline'>
					        <input type='checkbox' name='node[]' value='16' checked/>菜单删除</label>
			        	</li>
			        </ul>
		        </li>
		        <li>
			        <label class='checkbox inline'>
			        <input type='checkbox' name='group[]' value='' />角色</label>
			        <ul>
				        <li>
				        	<label class='checkbox inline'>
				        	<input type='checkbox' name='node[]' value='5' checked/>角色列表</label>
			        	</li>
			        	<li>
			        		<label class='checkbox inline'>
			       			<input type='checkbox' name='node[]' value='6' checked/>角色添加</label>
			        	</li>
			        	<li>
			        		<label class='checkbox inline'>
			        		<input type='checkbox' name='node[]' value='7' checked/>角色编辑</label>
			        	</li>
			        	<li>
			        		<label class='checkbox inline'>
			        		<input type='checkbox' name='node[]' value='8' checked/>角色删除</label>
			        	</li>
			        </ul>
		        </li>
		        </ul>
	        </td>
	    </tr>
		</tbody>
		<tfoot id="tfoot" >
		<tr>
	    	<td colspan="2">
	    		<input type="button" class="btn btn-primary" name="save"  id="save" value="保存 " onclick="editSubmit()"/>&nbsp;&nbsp;
	            <input type="button" class="btn btn-primary" name="edit"  id="edit" value="编辑 " />&nbsp;&nbsp;
	            <input type="button" class="btn btn-success" name="backid" id="backid" value="返回列表"/>
	        </td>
	    </tr>
		</tfoot>
	</table>
</form>
</body>
</html>